<template>
	<div class="form-control" @submit.prevent="updatePwd">
		<el-form :model="user" label-width="auto" style="width: 100%">
			<el-form-item label="原密码">
				<el-input
					 v-model.trim="user.oldPassword"
					 type="password"
					 placeholder="请输入原密码"
				  />
			</el-form-item>
			<el-form-item label="新密码">
				<el-input
					 v-model.trim="user.password"
					 type="password"
					 placeholder="请输入新密码"
				  />
			</el-form-item>
			<el-form-item label="确认密码">
				<el-input
					 v-model.trim="user.password2"
					 type="password"
					 placeholder="请再次输入新密码"
				  />
			</el-form-item>
			
		</el-form>
	</div>
</template>

<script>
import axios from "axios";
import Token from "@/api/token.js";

export default {
	data(){
		return {
			user: {
				oldPassword: "",
				password: "",
				password2: "",
			},
		}
	},
  created() {
    window.$bus.on("updatepwd-user", this.updatePwd);
  },
  methods:{
     updatePwd(index){
       if (this.user.oldPassword === ""){
          this.$layer.msg('原密码不能为空');
          return;
       }
       if (this.user.password ===""){
          this.$layer.msg('请输入新密码');
          return;
       }
       if (this.user.password !==this.user.password2){
          this.$layer.msg('两次输入的密码不一致!!');
          return;
       }
       this.$api.updatePwd(this.user).then(ret=>{
          this.$layer.msg('密码更新成功！');
           // 向 父页面 消息总线 发送 close-win 关闭窗口事件、通知父页面 关闭弹框
          // 父页面 监听 close-win , 并关闭该窗口 刷新
          //跳转到登录页面,清空session
          // localStorage.removeItem('authToken')
          parent.$bus.emit('close-win-refresh', index);
          // this.$router.push({name:"login"})
          this.$router.push('/login')
          return;

       })
     },
  //
  //   async updatePwd(){
  //     try {
  //       const response = await axios.post('/user-app/user/update-Pwd', this.user);
  //       if (response.data.success) {
  //         this.$layer.msg('密码更新成功！');
  //         // 重置表单状态
  //         this.user = { oldPassword: "", password: "", password2: "" };
  //         this.isFormValid = false;
  //         //跳转到登录页面,清空session
  //         router.push({name:'login'});
  //         localStorage.removeItem('authToken')
  //
  //       } else {
  //         this.$layer.msg(response.data.message || '密码更新失败！');
  //       }
  //     } catch (error) {
  //       this.this.$layer.msg('请求失败，请稍后再试！');
  //       console.error(error);
  //
  //     }
  //   },
  //   checkForm() {
  //     // 检查表单是否有效
  //     this.isFormValid = this.user.oldPassword &&
  //                        this.user.password &&
  //                        this.user.password2 &&
  //                        this.user.password === this.user.password2;
  //
  //     // 如果表单有效，则调用updatePwd
  //     if (this.isFormValid) {
  //       this.updatePwd();
  //     }
  //   }
  // },
  // // 使用watch来监听user对象的变化，但在这个例子中我们直接在新密码和确认密码的@input事件中调用了checkForm
  // watch: {
  //   user: {
  //     handler(newVal, oldVal) {
  //       this.checkForm();
  //     },
  //     deep: true,
  //     immediate: true
  //   }
  },
}
</script>

<style scoped>
.form-control {
	padding: 30px 30px 10px;
}
</style>